////////////////////////////////////////////////////////////////////////////////
//这里实现标签页的切换
////////////////////////////////////////////////////////////////////////////////


function initSwitchTab() {
  //1.先获取到相关的元素(标签页按钮 , 会话列表 , 好友列表)
  let tabSession  = document.querySelector('.tab .tab-session');
  let tabFriend = document.querySelector('.tab .tab-friend'); 
  //querySelectorAll 可以同时获取到多个元素,得到的结果是个数组
  //[0] 代表的就是会话列表
  //[1] 代表的是好友列表
  let lists = document.querySelectorAll('.list');

  //2.针对标签页按钮, 注册点击事件
    
  //  如果是点击 会话标签按钮 就会对会话标签按钮BG图进行设置
  //  同时将会话列表显示出来 , 将好友列表隐藏

  //  如果是点击 好友标签按钮 就会对好友标签按钮进行设置
  //  同时 将好友列表显示出来 , 将会话列表隐藏
  tabSession.onclick = function(){
    //因为js代码执行是在html里面,所以这里的url路径是相对于html的路径
    //而css代码执行是在css里面,所以这里的url路径是相对于css的路径

      //设置会话标签按钮的背景图
      tabSession.style.backgroundImage = 'url(img/会话3.png)';
      tabFriend.style.backgroundImage = 'url(img/用户1.png)';
  }

  tabFriend.onclick = function(){
    //设置图标
      tabSession.style.backgroundImage = 'url(img/会话1.png)';
      tabFriend.style.backgroundImage = 'url(img/用户3.png)';
  } 

}

